jQuery treetable

$("#example-basic-static").treetable();

Basic Expandable Tree

app
controllers
application_controller.rb
helpers
models
views
$("#example-basic-expandable").treetable({ expandable: true });

Complex Tree With Drag and Drop

This example uses jQuery UI's Draggable and Droppable components. The tree has 459 nodes.


Examples: 2-1-1, 3-1-1-2-2 and 3-2-1-2-3-1-2-2-1-1-1-1-2-5
Expand all Collapse all
Name Kind Size
Acknowledgements.rtfFile480.95 KB
CHUDFolder--
amberFolder--
AmberTraceFormats.pdfFile124.46 KB
BigTopFolder--
BigTopUserGuide.pdfFile1314.71 KB
SaturnFolder--
SaturnUserGuide.pdfFile694.29 KB
SharkFolder--
SharkUserGuide.pdfFile12902.51 KB
simg4Folder--
simg4_plusFolder--
simg5Folder--
DocSetsFolder--
com.apple.ADC_Reference_Library.CoreReference.docsetFolder--
ContentsFolder--
Info.plistFile1.23 KB
ResourcesFolder--
docSet.dsidxFile41504 KB
docSet.skidxFile43072 KB
DocumentsFolder--
documentationFolder--
AccessibilityFolder--
ReferenceFolder--
AccessibilityCarbonRefFolder--
CarbonAXRefRevisionsFolder--
CarbonAXRefRevisions.htmlFile7.44 KB
IndexFolder--
index_of_book.htmlFile174.1 KB
index.htmlFile1.1 KB
ReferenceFolder--
reference.htmlFile196.28 KB
toc.htmlFile15.92 KB
AccessibilityLowlevelFolder--
accessibilityFolder--
CompositePage.htmlFile5.7 KB
index.htmlFile1.67 KB
toc.htmlFile2.87 KB
accessibility-constants.htmlFile26.94 KB
accessibility-datatypes.htmlFile11.02 KB
accessibility-functions.htmlFile15.55 KB
accessibility-mpindex.htmlFile9.87 KB
AXActionConstantsFolder--
CompositePage.htmlFile15.08 KB
index.htmlFile1.67 KB
toc.htmlFile4.9 KB
AXAttributeConstantsFolder--
AXErrorFolder--
AXNotificationConstantsFolder--
AXRoleConstantsFolder--
AXTextAttributedStringFolder--
AXUIElementFolder--
AXValueFolder--
AXValueConstantsFolder--
index.htmlFile10.1 KB
UniversalAccessFolder--
adcstyle.cssFile15.86 KB
AppleApplicationsFolder--
ReferenceFolder--
AddressBookC_CollectionFolder--
IndexFolder--
index_of_book.htmlFile153.98 KB
index.htmlFile13.62 KB
IntroductionFolder--
Introduction.htmlFile5.41 KB
RevisionHistory.htmlFile4.66 KB
AddressBookRefUpdateFolder--
ArticlesFolder--
AddressBook_10.1-10.2_SymbolChanges.htmlFile80.84 KB
AddressBook_10.2-10.3_SymbolChanges.htmlFile54.2 KB
AddressBook_10.3-10.4_SymbolChanges.htmlFile14.78 KB
AddressBook_10.4-10.5_SymbolChanges.htmlFile11.03 KB
Introduction.htmlFile7.3 KB
RevisionHistory.htmlFile6.19 KB
index.htmlFile1.08 KB
toc.htmlFile2.84 KB
AMWorkflow_classFolder--
AMWorkflowController_classFolder--
AMWorkflowView_ClassFolder--
AppleApp_Aperture_002Folder--
Automator_constantsFolder--
AutomatorFrameworkFolder--
AutomatorReferenceFolder--
AutomatorRefUpdateFolder--
CalendarStoreFrameworkFolder--
CalendarStoreReferenceFolder--
CalendarStoreRefUpdateFolder--
Dashboard_RefFolder--
FinalCutPro_XMLFolder--
InstantMessageFrameworkFolder--
InstantMessageFrameworkRefFolder--
InstantMessageRefUpdateFolder--
iSyncJavaScriptRefFolder--
iSyncManualTestSuiteRefFolder--
iSyncSyncMLRefFolder--
MessageFrameworkReferenceFolder--
Motion_FXPlug_RefFolder--
SafariCSSRefFolder--
SafariHTMLRefFolder--
SyncServicesRefUpdateFolder--
SyncServicesSchemaRefFolder--
WebKitDOMRefFolder--
AppleScriptFolder--
ReferenceFolder--
StudioReferenceFolder--
artFolder--
boxes.gifFile11.52 KB
browser.gifFile26.04 KB
button_in_window.gifFile8.17 KB
cc_app_info_window.gifFile24.36 KB
circular_prog_indicator.gifFile0.65 KB
color_panel.jpgFile24.91 KB
color_well.gifFile7.58 KB
combobox.gifFile1.44 KB
comboboxlist.gifFile4.12 KB
display_alert.gifFile28.69 KB
display_dialog.gifFile28.42 KB
doc_exp_groups.gifFile22.52 KB
drawer.gifFile34.4 KB
drawer_content_view.gifFile8.21 KB
drawer_instances_in_nib.gifFile20.97 KB
drawers_in_palette.gifFile17.34 KB
files_owner_in_nib.gifFile15.24 KB
font_panel.gifFile17.16 KB
hw_exp_grps_files.gifFile15.35 KB
ib_number_formatter.gifFile1.46 KB
image_tab_mainmenu_nib.gifFile12.33 KB
image_view_from_app.gifFile17.18 KB
matrix.gifFile7.36 KB
menu_item.gifFile16.85 KB
menu_showing_file_menu.gifFile17 KB
movie_view.gifFile34.76 KB
number_formatter_info.gifFile24.8 KB
open_panel.gifFile32.06 KB
outline_view.gifFile18.7 KB
popup_button.gifFile6.76 KB
progindindet.gifFile3.78 KB
save_panel.gifFile39.43 KB
secure_text_field.gifFile9.91 KB
simple_toolbar.gifFile10.4 KB
sliders.gifFile11.01 KB
sounds_in_nib_window.gifFile22.26 KB
split_view.gifFile15.73 KB
stepper.gifFile1.08 KB
table_app.gifFile22.72 KB
table_view.gifFile14.55 KB
tabview.gifFile24.86 KB
text_fields.gifFile7.1 KB
text_view.gifFile12.18 KB
to_do_outline.gifFile15.4 KB
window.gifFile6.41 KB
IndexFolder--
index.htmlFile1.13 KB
sr10_panel_suiteFolder--
sr10_pplugin_suiteFolder--
sr11_textview_suiteFolder--
sr1_aboutFolder--
sr2_fundamentalsFolder--
sr3_app_suiteFolder--
sr4_container_suiteFolder--
sr5_control_suiteFolder--
sr6_data_suiteFolder--
sr7_doc_suiteFolder--
sr8_drag_drop_suiteFolder--
sr9_menu_suiteFolder--
sr_historyFolder--
toc.htmlFile132.84 KB
CarbonFolder--
CocoaFolder--
CoreFoundationFolder--
cssFolder--
DarwinFolder--
DeveloperToolsFolder--
DeviceDriversFolder--
GamesFolder--
GraphicsImagingFolder--
HardwareFolder--
HardwareDriversFolder--
imagesFolder--
index-date.htmlFile74.06 KB
index-date0.htmlFile284.1 KB
index-date2.htmlFile73.94 KB
index-date3.htmlFile74.4 KB
index-date4.htmlFile75.11 KB
index-date5.htmlFile41.11 KB
index-rev-date.htmlFile49.03 KB
index-rev-revision.htmlFile49.01 KB
index-rev-title.htmlFile49.03 KB
index-rev-topic.htmlFile71.41 KB
index-rev-topic0.htmlFile93.76 KB
index-rev-topic2.htmlFile29.61 KB
index-title.htmlFile73.91 KB
index-title0.htmlFile284.11 KB
index-title2.htmlFile74.7 KB
index-title3.htmlFile73 KB
index-title4.htmlFile74.15 KB
index-title5.htmlFile42.91 KB
index-topic.htmlFile72.46 KB
index-topic0.htmlFile601.26 KB
index-topic10.htmlFile74.41 KB
index-topic2.htmlFile73.6 KB
index-topic3.htmlFile72.47 KB
index-topic4.htmlFile71.89 KB
index-topic5.htmlFile73.89 KB
index-topic6.htmlFile73.1 KB
index-topic7.htmlFile70.55 KB
index-topic8.htmlFile71.25 KB
index-topic9.htmlFile72.56 KB
index.htmlFile20.65 KB
InternationalizationFolder--
InternetWebFolder--
iPhoneFolder--
jsFolder--
LegacyTechnologiesFolder--
MacOSXFolder--
MacOSXServerFolder--
MusicAudioFolder--
NetworkingFolder--
OpenSourceFolder--
PerformanceFolder--
PortingFolder--
PrintingFolder--
QuickTimeFolder--
ResourcesFolder--
ScriptingAutomationFolder--
SecurityFolder--
StorageFolder--
TextFontsFolder--
UserExperienceFolder--
WebObjectsFolder--
referencelibraryFolder--
adc.cssFile1.46 KB
base.cssFile1.08 KB
imagesFolder--
body_bg.gifFile0.24 KB
main_bgbottom.gifFile2.35 KB
main_bgtop.gifFile6.88 KB
main_bgtop_stroke.gifFile7.62 KB
UpdateBanner_core.pngFile24.25 KB
index.htmlFile1.15 KB
version.plistFile0.44 KB
com.apple.ADC_Reference_Library.DeveloperTools.docsetFolder--
ContentsFolder--
Info.plistFile1.33 KB
ResourcesFolder--
docSet.dsidxFile2752 KB
docSet.skidxFile5664 KB
DocumentsFolder--
documentationFolder--
adcstyle.cssFile15.86 KB
AppleApplicationsFolder--
AppleApplications.htmlFile0.22 KB
ConceptualFolder--
Dashcode_UserGuideFolder--
ContentsFolder--
ResourcesFolder--
de.lprojFolder--
AdvancedFolder--
chapter_8_section_1.htmlFile6.71 KB
chapter_8_section_2.htmlFile7.93 KB
chapter_8_section_3.htmlFile6.38 KB
ArtFolder--
apple_birthday_widget.jpgFile33.5 KB
canvas_inspector.jpgFile71.75 KB
countdown_attributes.jpgFile46.69 KB
project_window.jpgFile107.57 KB
source_code_inspector.jpgFile76.19 KB
webapp_add_code.jpgFile85.65 KB
webapp_add_part.jpgFile108.16 KB
webapp_first_test.jpgFile86.82 KB
webapp_project_window.jpgFile152.27 KB
chapter_999_section_1.htmlFile6.3 KB
CodeAndDebuggingFolder--
Dashcode_UserGuide.pdfFile1875.27 KB
DebuggingSharingFolder--
DesignToolsFolder--
index.htmlFile1.11 KB
IntroductionFolder--
MakingaWebAppFolder--
MakingaWidgetwithDashcodeFolder--
PartsReferenceFolder--
TemplatesFolder--
toc.htmlFile38.57 KB
WidgetProjectsFolder--
en.lprojFolder--
AdvancedFolder--
chapter_8_section_1.htmlFile6.6 KB
chapter_8_section_2.htmlFile7.4 KB
chapter_8_section_3.htmlFile6.24 KB
ArtFolder--
chapter_999_section_1.htmlFile6.2 KB
CodeAndDebuggingFolder--
Dashcode_UserGuide.pdfFile1087.36 KB
DebuggingSharingFolder--
DesignToolsFolder--
index.htmlFile1.09 KB
IntroductionFolder--
MakingaWebAppFolder--
MakingaWidgetwithDashcodeFolder--
PartsReferenceFolder--
TemplatesFolder--
toc.htmlFile38.11 KB
WidgetProjectsFolder--
es.lprojFolder--
fr.lprojFolder--
it.lprojFolder--
ja.lprojFolder--
nl.lprojFolder--
zh.lprojFolder--
Dashboard-date.htmlFile10.88 KB
Dashboard-rev-date.htmlFile8.85 KB
Dashboard-rev-revision.htmlFile8.83 KB
Dashboard-rev-title.htmlFile8.85 KB
Dashboard-title.htmlFile10.71 KB
index-date.htmlFile11.79 KB
index-rev-date.htmlFile9.38 KB
index-rev-revision.htmlFile9.36 KB
index-rev-title.htmlFile9.37 KB
index-rev-topic.htmlFile9.37 KB
index-title.htmlFile11.78 KB
index-topic.htmlFile12.39 KB
index.htmlFile7.24 KB
iSync-date.htmlFile8.17 KB
iSync-title.htmlFile8 KB
CarbonFolder--
Carbon.htmlFile0.21 KB
DesignGuidelines-date.htmlFile9.93 KB
DesignGuidelines-rev-date.htmlFile7.45 KB
DesignGuidelines-rev-revision.htmlFile7.44 KB
DesignGuidelines-rev-title.htmlFile7.45 KB
DesignGuidelines-title.htmlFile9.77 KB
index-date.htmlFile19.66 KB
index-rev-date.htmlFile12.35 KB
index-rev-revision.htmlFile12.33 KB
index-rev-title.htmlFile12.34 KB
index-rev-topic.htmlFile12.98 KB
index-title.htmlFile19.65 KB
index-topic.htmlFile22.64 KB
index.htmlFile10.96 KB
IntelBasedMacs-date.htmlFile10.5 KB
IntelBasedMacs-title.htmlFile10.33 KB
Performance-date.htmlFile9.14 KB
Performance-title.htmlFile8.98 KB
Porting-date.htmlFile8.78 KB
Porting-title.htmlFile8.63 KB
Tools-date.htmlFile16.03 KB
Tools-rev-date.htmlFile10.85 KB
Tools-rev-revision.htmlFile10.83 KB
Tools-rev-title.htmlFile10.84 KB
Tools-title.htmlFile15.88 KB
UserExperience-date.htmlFile8.85 KB
UserExperience-title.htmlFile8.69 KB
CocoaFolder--
CoreFoundationFolder--
cssFolder--
DarwinFolder--
DeveloperToolsFolder--
GraphicsImagingFolder--
HardwareDriversFolder--
imagesFolder--
index-date.htmlFile38.14 KB
index-rev-date.htmlFile20.91 KB
index-rev-revision.htmlFile20.89 KB
index-rev-title.htmlFile20.9 KB
index-rev-topic.htmlFile45.06 KB
index-title.htmlFile38.14 KB
index-topic.htmlFile77.78 KB
index.htmlFile17.08 KB
InternationalizationFolder--
InternetWebFolder--
JavaFolder--
jsFolder--
LegacyTechnologiesFolder--
MacOSXFolder--
OpenSourceFolder--
PerformanceFolder--
PortingFolder--
ResourcesFolder--
ScriptingAutomationFolder--
UserExperienceFolder--
XcodeFolder--
featuredarticlesFolder--
adcstyle.cssFile15.86 KB
AppleApplicationsFolder--
idxDashboard-date.htmlFile8.35 KB
idxDashboard-title.htmlFile8.24 KB
index-date.htmlFile8.52 KB
index-title.htmlFile8.51 KB
index-topic.htmlFile8.51 KB
index.htmlFile6.46 KB
CarbonFolder--
CocoaFolder--
cssFolder--
DeveloperToolsFolder--
GamesFolder--
imagesFolder--
index-date.htmlFile16.03 KB
index-title.htmlFile16.03 KB
index-topic.htmlFile19.32 KB
index.htmlFile10.98 KB
jsFolder--
LegacyTechnologiesFolder--
ScriptingAutomationFolder--
UserExperienceFolder--
index.htmlFile0.23 KB
qaFolder--
referenceFolder--
referencelibraryFolder--
releasenotesFolder--
samplecodeFolder--
technicalnotesFolder--
technicalqasFolder--
technotesFolder--
version.plistFile0.44 KB
iPhone SDK License.rtfFile37.93 KB
PerlFolder--
wxPerlFolder--
INSTALL.podFile8.26 KB
todo.txtFile2.3 KB
PythonFolder--
PyObjCFolder--
announcement.txtFile2.33 KB
api-notes-macosx.htmlFile30.09 KB
api-notes-macosx.txtFile18.37 KB
C-API.htmlFile11 KB
C-API.txtFile8.67 KB
coding-style.htmlFile4.53 KB
coding-style.txtFile2.92 KB
gnustep.htmlFile1.96 KB
gnustep.txtFile1.52 KB
index.htmlFile2.75 KB
index.txtFile2.64 KB
intro.htmlFile44.82 KB
intro.txtFile38.38 KB
protocols.htmlFile3.48 KB
protocols.txtFile2.79 KB
PyObjCTools.htmlFile10.96 KB
PyObjCTools.txtFile7.9 KB
QuartzFolder--
api-notes.txtFile1.47 KB
release-process.htmlFile3.83 KB
release-process.txtFile2.65 KB
structure.htmlFile6.55 KB
structure.txtFile5.1 KB
TODO.htmlFile13.49 KB
TODO.txtFile9.06 KB
tutorialFolder--
tutorial_embedFolder--
tutorial_reading.htmlFile12.85 KB
tutorial_reading.txtFile11.12 KB
website.lstFile0.58 KB
wrapping.htmlFile6.04 KB
wrapping.txtFile5.2 KB
xcodeFolder--
Xcode-Templates.htmlFile13.97 KB
wxPythonFolder--
RubyCocoaFolder--
wxWidgetsFolder--
Xcode Tools License.rtfFile18.79 KB
$("#example-advanced").treetable({ expandable: true });

// Highlight selected row
$("#example-advanced tbody").on("mousedown", "tr", function() {
  $(".selected").not(this).removeClass("selected");
  $(this).toggleClass("selected");
});

// Drag & Drop Example Code
$("#example-advanced .file, #example-advanced .folder").draggable({
  helper: "clone",
  opacity: .75,
  refreshPositions: true,
  revert: "invalid",
  revertDuration: 300,
  scroll: true
});

$("#example-advanced .folder").each(function() {
  $(this).parents("#example-advanced tr").droppable({
    accept: ".file, .folder",
    drop: function(e, ui) {
      var droppedEl = ui.draggable.parents("tr");
      $("#example-advanced").treetable("move", droppedEl.data("ttId"), $(this).data("ttId"));
    },
    hoverClass: "accept",
    over: function(e, ui) {
      var droppedEl = ui.draggable.parents("tr");
      if(this != droppedEl[0] && !$(this).is(".expanded")) {
        $("#example-advanced").treetable("expandNode", $(this).data("ttId"));
      }
    }
  });
});